{extend name="base" /}
{block name="right"}
<div class="main-content">
    <div class="breadcrumbs" id="breadcrumbs">
        <script type="text/javascript">
            try{ace.settings.check('breadcrumbs' , 'fixed')}catch(e){}
        </script>

        <ul class="breadcrumb">
            <li>
                <i class="icon-home home-icon"></i>
                <a href="#">Home</a>
            </li>

            <li>
                <a href="#">Forms</a>
            </li>
            <li class="active">Form Elements</li>
        </ul><!-- .breadcrumb -->

        <div class="nav-search" id="nav-search">
            <form class="form-search">
								<span class="input-icon">
									<input type="text" placeholder="Search ..." class="nav-search-input" id="nav-search-input" autocomplete="off" />
									<i class="icon-search nav-search-icon"></i>
								</span>
            </form>
        </div><!-- #nav-search -->
    </div>

    <div class="page-content">
        <div class="page-header">
            <h1>
                Form Elements
                <small>
                    <i class="icon-double-angle-right"></i>
                    Common form elements and layouts
                </small>
            </h1>
        </div><!-- /.page-header -->

        <div class="row">
            <div class="col-xs-12">
                <!-- PAGE CONTENT BEGINS -->

                <div class="table-responsive">
                    <table id="sample-table-1" class="table table-striped table-bordered table-hover">
                        <thead>
                        <tr>

                            <th>id</th>
                            <th>文章标题</th>
                            <th>作者</th>
                            <th>图片</th>
                            <th>标签</th>
                            <th>创建时间</th>
                            <th>修改时间</th>
                            <th>
                                <i class="icon-time bigger-110 hidden-480"></i>
                                操作
                            </th>

                        </tr>
                        </thead>

                        <tbody>
                        {volist name="article_select" id="vo"}
                        <tr>
                            <td>{$vo.id}</td>
                            <td>{$vo.title}</td>
                            <td>{$vo.author}</td>
                            <td><img src="__IMG__/{$vo.img}" width="50px"/> </td>
                            <td>
                             {volist name="$vo.tags" id="vo1"}
                                <div class="deltags">
                                    <span>{$vo1.name}</span>
                                    <input type="hidden" name="id" value="{$vo1.id}">
                                    <button class="btn btn-xs btn-danger">
                                        <i class="icon-trash bigger-120"></i>
                                    </button>
                                </div>
                             {/volist}

                                <input type="text" class="tags" placeholder="请填写新标签">
                                <a class="btn btn-xs btn-success">
                                <i class="icon-check bigger-120"></i>
                                </a>
                                <div></div>
                            </td>
                            <td>{$vo.create_time|date='Y-m-d H:i:s'}</td>
                            <td>{$vo.update_time|date='Y-m-d H:i:s'}</td>
                            <td>
                                <div class="visible-md visible-lg hidden-sm hidden-xs btn-group">
                                   <a class="btn btn-xs btn-info" href="{:url('article/upd',array('id'=>$vo.id))}">
                                        <i class="icon-edit bigger-120"></i>
                                    </a>

                                    <a class="btn btn-xs btn-danger">
                                        <i class="icon-trash bigger-120"></i>
                                    </a>
                                </div>

                                <div class="visible-xs visible-sm hidden-md hidden-lg">
                                    <div class="inline position-relative">
                                        <button class="btn btn-minier btn-primary dropdown-toggle" data-toggle="dropdown">
                                            <i class="icon-cog icon-only bigger-110"></i>
                                        </button>

                                        <ul class="dropdown-menu dropdown-only-icon dropdown-yellow pull-right dropdown-caret dropdown-close">
                                            <li>
                                                <a href="#" class="tooltip-info" data-rel="tooltip" title="View">
																				<span class="blue">
																					<i class="icon-zoom-in bigger-120"></i>
																				</span>
                                                </a>
                                            </li>

                                            <li>
                                                <a href="#" class="tooltip-success" data-rel="tooltip" title="Edit">
																				<span class="green">
																					<i class="icon-edit bigger-120"></i>
																				</span>
                                                </a>
                                            </li>

                                            <li>
                                                <a href="#" class="tooltip-error" data-rel="tooltip" title="Delete">
																				<span class="red">
																					<i class="icon-trash bigger-120"></i>
																				</span>
                                                </a>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </td>
                        </tr>
                        {/volist}
                        </tbody>
                    </table>
                </div><!-- /.table-responsive -->
              {$article_select |raw}
            </div>
        </div>
    </div>
</div>
<script>
    $(function () {
        $('.btn-success').bind('click',function () {
            var $value =$(this).prev().val();
            if($value.length==0){
                alert('请输入标签');
            }else{
                var $id =$(this).parents('tr').find('td:eq(0)').html();
                $.ajax({
                    type:'post',
                    data:{'id':$id,'value':$value},
                    url:"{:url('admin/article/articleTagsAjax')}",
                    success:function ($data) {
                        if ($data.status == 0){
                           alert('没有，请手动添加');
                            window.location.reload();
                            }else
                                if($data.status == -1){
                            alert('已经存在');
                                    window.location.reload();
                        }else
                            if($data.status == -2){
                                alert('添加失败');
                                window.location.reload();
                            }
                            else
                            if($data.status == 1){
                                alert('添加成功');
                                window.location.reload();
                            }
                        }

                })
            }

        });
        $(".tags").on('keyup',function () {
           var $value=$(this).val();
           var _this =$(this);
           if ($value.length){
            $.ajax({
                type:'post',
                data:{'tags':$value},
                url:"{:url('admin/article/findTagsAjax')}",
                success:function ($data) {
                    if ($data != ''){
                        $(_this).nextAll('div').html('');
                        $.each($data,function(i,e) {
                            $(_this).nextAll('div').append(e.name+'<br>');
                        })

                    }else {
                        $(_this).nextAll('div').html('');
                    }

                }
            })
        }else {$(_this).nextAll('div').html('');
           }
        });
    $(".deltags").click(function (event) {
      var $tags_id=$(this).find("input:hidden").val();
      var $article_id =$(this).parents("tr").find("td:eq(0)").html();
        $.ajax({
          url:'{:url("admin/article/articleTagsDelAjax")}',
          type:'post',
          data:{'tags_id':$tags_id,'article_id':$article_id},
            success:function (data) {
                if(data==true){
                    alert("标签删除成功");
                    window.location.reload();
                }else {
                    alert("标签删除失败");
                    window.location.reload();
                }

            }
      })
    })
    })
</script>
{/block}